<template>
	<view>
		<scroll-view class="login-scroll" scroll-y>
			<view class="login-card login-header">
				<view class="title">你好</view>
				<view class="detail">欢迎回来</view>
			</view>
			<view class="login-card login-body">
				<view :class="{'input': true, 'input-active': isPhone}">
					<input class="input__text" type="number" maxlength="11" @input="changePhoneInput"
						@focus="onFocusPhone" @blur="onBlurPhone" />
					<view class="input__label">
						<view v-show="!isPhone" class="input__label-content">请输入手机号</view>
						<view v-show="isPhone" class="input__label-content">手机号</view>
					</view>
					<view class="input__line" />
				</view>
				<view class="input" :class="{'': true, 'input-active': isPass}">
					<input class="input__text" password maxlength="16" @input="changePassInput" @focus="onFocusPass"
						@blur="onBlurPass" />
					<view class="input__label">
						<view v-show="!isPass" class="input__label-content">请输入登录密码</view>
						<view v-show="isPass" class="input__label-content">登录密码</view>
					</view>
					<view class="input__line" />
				</view>
				<view class="forget-pass d-f j-c-e">
					<view class="text" @click="toRegisterPage">注册账号</view>
					<view class="text" @click="toUserResetPassPage">忘记密码？</view>
				</view>
			</view>
			<view class="login-card login-footer">
				<slw-button v-if="phone.length === 11 && pass.length >= 6" circle class="button user-login"
					@click="onUserLogin">登录</slw-button>
				<slw-button v-else circle disabled class="button user-login">登录</slw-button>
			</view>
			<!-- <slw-button circle  class="button user-login" @click='toHome'>测试</slw-button> -->
		</scroll-view>
	</view>
</template>

<script>
	import {
		setLoginInfo
	} from '@/utils/storage.js'
	import {
		siteLogin
	} from '@/api/site.js'
	import SlwButton from '@/components/slw-ui/button/index.vue'
	import {
		toUserResetPassPage,
		toUserLaunch,
		toUserRegisterPage
	} from '@/utils/PageRouter.js'
	// const jyJPush = uni.requireNativePlugin('JG-JPush')
	const dcRichAlert = uni.requireNativePlugin('Trader')
	export default {
		components: {
			SlwButton
		},
		data() {
			return {
				contentStyle: {
					overflow: 'initial'
				},
				phone: 13883835780,
				pass: 123456,
				isPhone: false,
				isPass: false,
				user: 0,
				islogin: false
			}
		},
		onLoad(item) {
			if (item) {
				this.user = item.user
			}
		},
		methods: {
			toHome() {
				uni.switchTab({
					url:'/pages/tabBar/home/index'
				})
			},
			toUserResetPassPage() {
				toUserResetPassPage()
			},
			toRegisterPage() {
				toUserRegisterPage()
			},
			onFocusPhone() {
				this.isPhone = true
			},
			onBlurPhone(e) {
				if (e.detail.value.length === 0) {
					this.isPhone = false
				}
			},
			onFocusPass() {
				this.isPass = true
			},
			onBlurPass(e) {
				if (e.detail.value.length === 0) {
					this.isPass = false
				}
			},
			changePhoneInput(e) {
				const {
					detail: {
						value
					}
				} = e
				this.phone = value
			},
			changePassInput(e) {
				const {
					detail: {
						value
					}
				} = e
				this.pass = value
			},
			frequency() {
				let user_id = uni.getStorageSync('user_id')
				uni.request({
					url: 'https://wechat.sou-liang.com/api/v1/frequency',
					method: 'POST',
					data: {
						type: 3,
						id: user_id
					},
					success: (res) => {
						
					}
				});
			},
			onUserLogin() {
				this.frequency()
				const {
					phone,
					pass
				} = this
				uni.showLoading({
					title: '加载中...'
				})
				siteLogin({
					username: phone,
					password: pass
				}).then(res => {
					uni.hideLoading()
					if (res.code === 200) {
						uni.setStorageSync('p_id', res.data.token.member.pid)
						uni.setStorageSync('user_id', res.data.token.member.account.id)
						let pid = uni.getStorageSync('p_id')
						uni.showToast({
							title: '登录成功',
							icon: 'none'
						})
						// uni.reLaunch({
						// 	url:'../../tabBar/home/index'
						// })
						getApp().globalData.islogin=true
						// getApp().globalData.isAccount=true
						setLoginInfo(res.data.token)
						this.$forceUpdate()
						uni.setStorageSync('userinfo_key', res.data.token.member)
						if (res.data.present != '') {
							uni.setStorageSync('new_user', res.data.present)
						}
						if (res.data.login == true) {
							uni.setStorageSync('newuserType', res.data.login)
						}
						if (this.user == 1) {
							toUserLaunch(true)
						} else {
							this.islogin = true
							if (res.data.login) {
								getApp().globalData.islogin = true
							}
							toUserLaunch()
							// let num	=uni.getStorageSync('MEMBER_INFO')
							// if(num==1){
							// 	uni.
							// }

						}
						// const jyJPush = uni.requireNativePlugin('JY-JPush');
						// 		jyJPush.setJYJPushTags(
						// 		{
						// 			userTag: 'sj'
						// 		},
						// 		result => {
						// 				}
						// 		);
						// 
						// dcRichAlert.setAlias({
						// 	'alias': res.data.token.member.id,
						// })


						// const jyJPush = uni.requireNativePlugin('JY-JPush');userAlias 
						// jyJPush.setJYJPushAlias(
						//     {
						//         alias: res.data.token.member.id
						//     },
						//     result => {
						//         //  设置成功或者失败，都会通过这个result回调返回数据；数据格式保持极光返回的安卓/iOS数据一致
						//         //  注：若没有返回任何数据，考虑是否初始化完成
						//         // uni.showToast({
						//         //  icon: 'none',
						//         //  title: JSON.stringify(result)
						//         // });
						//     }
						// );

						//   jyJPush.addJYJPushReceiveNotificationListener(result => {
						//       //  监听成功后，若收到推送，会在result返回对应的数据；数据格式保持极光返回的安卓/iOS数据一致
						//       uni.showToast({
						//           icon: 'none',
						//           title: JSON.stringify(result.notificationContent)
						//       });
						// //收到推送
						//   });
						//   jyJPush.addJYJPushReceiveOpenNotificationListener(result => {
						//       //  监听成功后，若点击推送消息，会触发result；数据格式保持极光返回的安卓/iOS数据一致
						// //点击推送
						//       uni.showToast({
						//           icon: 'none',
						//           title: JSON.stringify(result.notificationContent)
						//       });
						//   });


					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						})
					}
				}).catch(res => {
					uni.hideLoading()
					uni.showToast({
						title: res.message,
						icon: 'none'
					})
					// error
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 75%;
		border-radius: 16rpx;
	}

	.rect {
		width: 70%;
		height: 120px;
		background-color: #FF6B4B;
		border-radius: 16rpx;
	}

	.new_login {
		padding: 20px 10px;
		background-color: #FF6B4B;
		text-align: center;
		position: relative;
		border-radius: 16rpx;

		.title {
			font-size: 30px;
			color: #fff;
			font-weight: bold;
			font-family: Arial, Helvetica, sans-serif;
		}

		.quan_text {
			margin: 10px 0 20px;
		}

		.quan_cont {}

		.quan_cont {
			width: 100%;
			// height: 180px;
			position: relative;
			background: red;
			margin: 10px auto;
			overflow: hidden;

			.quan_num {
				// width: 100%;
				background-color: #fff;
				color: #FF393A;
				font-size: 40px;
				font-weight: bold;
			}

			.text {
				color: #fff;
				font-size: 14px;
				margin: 5px 0;
			}
		}

		// .quan_cont:before,
		// .quan_cont:after {
		//   content: '';
		//   display: block;
		//   width: 20px;
		//   height: 100%;
		//   background-color: #FF6B4B;
		//   background-size: 20px 20px; /* 一个repeat的大小 */
		//   background-repeat: repeat-y;
		//   background-image: radial-gradient(#fff 8px, transparent 8px);
		//   position: absolute;
		//   top: 0;
		// }
		// .quan_cont:before {
		//   left: -10px; /* 半圆，只显示一个repeat的一半 */
		// }
		// .quan_cont:after {
		//   right: -10px; 
		// } 
		.login_btn {
			background-color: #fff;
			padding: 5px 10px;
			border-radius: 20px;
			font-size: 16px;
			color: #FF6B4B;
		}

		.login_colse {
			position: absolute;
			bottom: -40px;
			color: #fff;
			left: 50%;
			transform: translate(-50%, 50%);
		}
	}

	.login-scroll {
		height: 100vh;
		background: #fff;

		.login-card {
			padding: 90rpx 60rpx 0;
		}

		.login-header {
			.title {
				font-size: 36rpx;
			}

			.detail {
				font-size: 32rpx;
				color: #999;
			}
		}

		.login-body {
			.input {
				position: relative;
				vertical-align: top;
				overflow: hidden;
				padding: 40rpx 0 20rpx;
			}

			.input__text {
				position: relative;

				.uni-input-input {
					padding: 0.5em 0em 0.25em;
					font-size: 2em;
				}

				z-index: 10;
			}

			.input__label {
				color: #9e9e9e;
				width: 100%;
				position: absolute;
				left: 0;
				bottom: 20rpx;
				transition: transform 0.2s 0.15s;
				transform-origin: left;

				&-content {
					font-size: 32rpx;
					position: relative;
					display: block;
					width: 100%;
				}
			}

			.input__line {
				width: 100%;
				position: absolute;
				bottom: 0;
				left: 0;
				border-bottom: 2rpx solid rgb(229, 229, 229);
			}

			.input-active {
				.input__label {
					transform: translate3d(0, -1.25em, 0) scale3d(0.75, 0.75, 1);
				}

				.input__line {
					border-color: $theme_color;
				}
			}

			.forget-pass {
				color: #9e9e9e;
				font-size: 24rpx;
				padding-top: 16rpx;
				display: flex;
				justify-content: space-between;
			}
		}

		.login-footer {}
	}
</style>
